<template>
  <el-dialog :close-on-click-modal="true" :visible.sync="visible" :title="title" width="1088px" class="m-log-dialog" :destroy-on-close="true" @close="handleClose">
    <logContain v-if="visible" :log-type="logType" :title="title" />
  </el-dialog>
</template>

<script>
import logSettings, { COMPONENT_LOG, DRAWING_LOG, NODE_LOG, REVIEW_PLANNING } from '@/utils/log'
import logContain from './index'
export default {
  name: 'LogDialog',
  components: {
    logContain
  },
  props: {
    logType: {
      type: String,
      required: true,
      validator: function(value) {
        return [COMPONENT_LOG, DRAWING_LOG, NODE_LOG, REVIEW_PLANNING].includes(value)
      }
    },
    dialogVisible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      visible: this.dialogVisible,
      logSettings: { ...logSettings[this.logType] }
    }
  },
  computed: {
    title() {
      return this.logSettings ? `${this.logSettings.title}管理日志` : ''
    }
  },
  watch: {
    dialogVisible() {
      this.visible = this.dialogVisible
    }
  },
  methods: {
    handleClose() {
      this.$emit('update:dialogVisible', false)
    }
  }
}
</script>

<style  lang="scss">
  .m-log-dialog{
    .el-dialog__body{
      padding: 10px 20px
    }
  }
</style>
